<template>
	<view class="box">
		<view class="main">
			<view v-for="(item,index) in examList" :key="item.id">
				<component v-if="item.examSubject.subjectType == 1" :is="'ExamRadioItem'" :examItem="item"
					:info="index + 1"></component>
				<component v-if="item.examSubject.subjectType == 2" :is="'ExamMultipleItem'" :examItem="item"
					:info="index + 1"></component>
				<component v-if="item.examSubject.subjectType == 3" :is="'ExamDeterItem'" :examItem="item"
					:info="index + 1"></component>
				<component v-if="item.examSubject.subjectType == 4" :is="'ExamFillItem'" :examItem="item"
					:info="index + 1"></component>

			</view>

		</view>

		<!-- 底部内容 -->
		<view class="bottom-subside"></view>
		<view class="footer">
			<view class="left-text">{{dataForm.userName}}<span class="sign" @click="handleToSeeSign">查看签名</span></view>
			<view class="num">{{dataForm.score}}分</view>
			<view class="right">
				<image class="myImg" src="@/static/images/index/yiwancheng.png"></image>
				<view class="pass-color">{{dataForm.rightNum}}</view>
				<image class="myImg" src="@/static/images/index/weitongguo.png"></image>
				<view class="fail-color">{{dataForm.wrongNum}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	import ExamRadioItem from './components/ExamRadioItem.vue'
	import ExamMultipleItem from './components/ExamMultipleItem.vue'
	import ExamDeterItem from './components/ExamDeterItem.vue'
	import ExamFillItem from './components/ExamFillItem.vue'
	export default {
		components: {
			ExamRadioItem,
			ExamMultipleItem,
			ExamDeterItem,
			ExamFillItem
		},
		data() {
			return {
				// test
				radioItem: {},
				// 业务id
				trainId: '',
				// 试卷id
				examPaperId: '',
				// 用户id
				userId: '',
				//试题
				examList: [],
				dataForm: {},

			}
		},
		onLoad(options) {
			this.examPaperId = options.examPaperId
			this.trainId = options.trainId
			this.userId = uni.getStorageSync('userInfo').userId
			this.initData()
		},
		methods: {
			initData() {
				const params = {
					trainId: this.trainId,
					examPaperId: this.examPaperId,
					userId: this.userId,
				}
				uni.$u.http.post(`/train/mobile/exam/getExamResult`, params).then(res => {
					if (res.code == 0) {
						this.examList = res.data.examAnswers
						this.dataForm = res.data
					}
				}).catch(err => {})
			},
			handleToSeeSign() {
				uni.$u.http.get(
					`/base/upload/bindFileUrl?fileUrl=${this.dataForm.signImg}`
				).then(res => {
					if (res.code == 0) {
						uni.navigateTo({
							url: `/pages/subPackagesD/mycenter/sginselect?url=
								${encodeURIComponent(JSON.stringify(res.data))}&noShow=true`
						})
					}
				}).catch(err => {})
			}
		}
	}
</script>

<style scoped lang="scss">
	.footer {
		width: 100%;
		box-sizing: border-box;
		background: #ffffff;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: fixed;
		padding: 40rpx 32rpx;
		z-index: 9;
		bottom: 0;
		font-size: 32rpx;
		font-weight: 400;

		.left-text {
			color: #8C8C8C;

			.sign {
				margin-left: 24rpx;
				color: #0F53AC;
			}
		}

		.num {
			font-size: 16px;
			font-weight: 700;
			color: #2B2B2B;
		}

		.right {
			display: flex;
			align-items: center;

			.myImg {
				width: 48rpx;
				height: 48rpx;
				margin: 0 8rpx;
			}

			.pass-color {
				color: #28B869;
				margin-right: 30rpx;
			}

			.fail-color {
				color: #FF4D4D;
			}
		}
	}
</style>
